<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%
  String path = request.getContextPath();
%>
<head>
  <script src="../assets/js/echarts.min.js"></script>
  <script src="../assets/js/jquery.min.js"></script>
  <script src="../assets/js/theme.js"></script>
  <script src="../assets/js/amazeui.min.js"></script>
  <script src="../assets/js/amazeui.datatables.min.js"></script>
  <script src="../assets/js/dataTables.responsive.min.js"></script>
  <%--    <script src="../assets/js/app.js"></script>--%>
</head>

<div class="container-fluid am-cf">
  <div class="row">
    <div class="am-u-sm-12 am-u-md-12 am-u-lg-9">
      <div class="page-header-heading"><span class="am-icon-home page-header-heading-icon"></span> 查看借阅历史信息
        <small>常用操作</small></div>
      <p class="page-header-description"></p>
    </div>
  </div>
</div>

<!-- 内容区域 -->
<div class="row-content am-cf">
  <div class="row">
    <div class="am-u-sm-12 am-u-md-12 am-u-lg-12">
      <div class="widget am-cf">
        <div class="widget-head am-cf">
          <div class="widget-title  am-cf">借阅历史列表</div>


        </div>
        <div class="widget-body  am-fr">



          <div class="am-u-sm-12">
            <table width="100%" class="am-table am-table-compact am-table-striped tpl-table-black "
                   id="example-r">
              <thead>
              <tr>
                <th>图书名</th>
                <th>借书时间</th>
                <th>应还时间</th>
                <%--                                <th>时间</th>--%>
                <%--                                <th>时间</th>--%>
                <%--                                <th>时间</th>--%>
                <th>操作</th>
              </tr>
              </thead>
              <tbody>
              <tr class="gradeX">
                <td>Amaze UI 模式窗口</td>
                <td>张鹏飞</td>
                <td>2016-09-26</td>
                <td>
                  <div class="tpl-table-black-operation">
                    <a href="javascript:;">
                      <i class="am-icon-pencil"></i> 归还
                    </a>
                    <a href="javascript:;" class="tpl-table-black-operation-del">
                      <i class="am-icon-bell"></i> 续借
                    </a>
                  </div>
                </td>
              </tr>
              <!-- more data -->
              </tbody>
            </table>
          </div>
          <div class="am-u-lg-12 am-cf">

            <div class="am-fr">
              <ul class="am-pagination tpl-pagination">
                <li class="am-disabled"><a href="#">«</a></li>
                <li class="am-active"><a href="#">1</a></li>
                <li><a href="#">2</a></li>
                <li><a href="#">3</a></li>
                <li><a href="#">4</a></li>
                <li><a href="#">5</a></li>
                <li><a href="#">»</a></li>
              </ul>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>
</div>
<script>
   //alert("开始查询");
  $.ajax({
    async:false,
    type:"post",
    url:'<%=path%>/admin/GetRecordServlet.do',
    success:function (result){
      var jsonResult = $.parseJSON(result);
      //alert(jsonResult.state);
      if (jsonResult.state==1000){
        var recordList = jsonResult.data;
        //alert(recordList.length);
        //alert(recordList);
        var innerHtml = "";
        for (var i= 0;i<recordList.length;i++){
          innerHtml +=
                  "  <tr class=\"even gradeC\">\n" +
                  "                                <td>"+recordList[i].book.name+"</td>\n" +
                  "                                <td>"+recordList[i].rentDate+"</td>\n" +
                  "                                <td>"+recordList[i].backDate+"</td>\n" +
                  "                                <td>\n" +
                  "                                    <div class=\"tpl-table-black-operation\" >\n" +
                  "                                        <a id=\"book_return_href\"  onclick=returnBook(\""+recordList[i].id+"\")>\n" +
                  "                                            <i class=\"am-icon-pencil\"></i> 归还\n" +
                  "                                        </a>\n" +
                  "                                        <a onclick=recordAgain(\""+recordList[i].id+"\",\""+recordList[i].backDate+"\") id=\"mem_delt_href\" class=\"tpl-table-black-operation-del\">\n" +
                  "                                            <i class=\"am-icon-bell\"></i> 续借\n" +
                  "                                        </a>\n" +
                  "                                    </div>\n" +
                  "                                </td>\n" +
                  "                            </tr>";
        };
        //alert(innerHtml);
        $("#example-r").children().eq(1).html(innerHtml);
      }else {
        alert("获取借阅历史失败！"+jsonResult.msg);
      }
    }
  });
</script>
<script>
  function returnBook(id) {
    alert(id);
    //$("#main_content").load("<%=path%>/admin/jsp/book-return.jsp?id="+id);
  }

  function recordAgain(id,backDate) {
    //alert(id);
    //alert(backDate);
    $.ajax({
      type: "post",
      url: "<%=path%>/admin/RecordAgainServlet.do",
      data: {rid:id,backDate:backDate},
      success: function (result) {
        var jsonResult = $.parseJSON(result);
        //alert(jsonResult.state);
        if (jsonResult.state == 1000) {
          alert("续借成功");
          window.location.reload(true);
        } else {
          alert("false");
        }
      }
    });
    //alert("end")
  }
</script>